<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>通讯录管理</title>
		<meta name="author" content="Designed By ZYB">
		<meta name="description" content="通讯录管理">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<style>
			.btn.btn-default.save{
				    font-weight: lighter;
					border-color: #15c288;
				    color: #FFFFFF;
				    background: #15c288;
				    -webkit-transition-duration:500ms;
				    transition: all .3s ease-in-out;
			}
			.btn.btn-default.save:hover{
					border-color: #15c288;
				    color: #15c288;
				    background: #FFFFFF;
				    -webkit-transition-duration:500ms;
				    transition: all .3s ease-in-out;
			}
			.selectpicker.form-control{
				border-color: #15c288;
				    color: #15c288;
				    background: #FFFFFF;
				    -webkit-transition-duration:500ms;
				    transition: all .3s ease-in-out;
			}
			
			.necessary{
				color: red;
			}
			
			p.col-md-10{
				color: #CCCCCC;
			}
		</style>
		<!-- 新 Bootstrap 核心 CSS 文件 -->
		<link href="http://cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
		<!-- 可选的Bootstrap主题文件（一般不用引入） -->
		<link href="http://cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" rel="stylesheet">
		<!-- Bootstrap社交图标文件   -->
		<link href="//cdn.bootcss.com/bootstrap-social/4.11.0/bootstrap-social.min.css" rel="stylesheet">
		<!--font-awesome字体库-->
		<link href="//cdn.bootcss.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet">
		<!-- zTree样式 -->
		<link rel="stylesheet" href="css/zTreeStyle.css" />
		<link rel="stylesheet" href="css/hz-font.css" />
		<link rel="stylesheet" href="css/index.css" />
	</head>

	<body class="group-page">
	
		<nav class="navbar navbar-main navbar-static-top">
			<div class="container header">
				<div class="row">
					<div class="navbar-header col-md-2">
						<a href="/" class="navbar-brand-home">
							<img src="logo.png" alt="logo" height="50px" width="125px"></a>
						</a>
						<button type="button" data-toggle="collapse" data-target=".navbar-collapse" class="navbar-toggle">
							<span class="sr-only">Toggle navigation</span>
							<span class="icon-bar"></span>
							<span class="icon-bar"></span>
							<span class="icon-bar"></span>
						</button>
					</div>
					<div class="collapse navbar-collapse col-md-10">
						<ul class="nav navbar-nav home">
							<li class="header_li">
								<a href="#">内容管理</a>
							</li>
							<li class="header_li">
								<a href="#">通讯录管理</a>
							</li>
							<li class="header_li">
								<a href="#">设置中心</a>
							</li>
							<li class="header_li">
								<a href="#">帮助</a>
							</li>
						</ul>
						<div class="pull-right">
							<ul class="nav nav-pills ">
								<li>
									<form class="navbar-form navbar-left" role="search">
										<div class="input-group">
											<input type="text" class="form-control" id="input_search" placeholder="姓名\拼音\手机号\首字母">
											<span class="input-group-btn">
									  		<button type="submit" class="btn btn-default"><span class="glyphicon glyphicon-search"></span></button>
											</span>
										</div>

									</form>
								</li>
								<li>
									<div class="dropdown text-center">
										<img data-toggle="dropdown" class="img-circle dropdown-toggle  navbar-btn" src="css/img/wjy_icon.png" id="dropdownMenu1">
										<ul class="dropdown-menu text-center" role="menu" aria-labelledby="dropdownMenu1" style="padding-bottom: 0;margin-top: -1px;">
											<li role="presentation"><img src="css/img/wjy_icon.png" width="50px" height="50px" alt="头像" class="img-thumbnail" />王敬业</li>
											<li class="li-dropdown" role="presentation" style="border-top: solid 1px #5BC0DE;"><a class="text-center" tabindex="-1" href="#"><span class="glyphicon glyphicon-home"></span> 返回首页 </a></li>
											<li class="li-dropdown" role="presentation" style="border-top: solid 1px #5BC0DE;">
												<a role="text-center" tabindex="-1" href="#"> <span class="glyphicon glyphicon-user"></span> 个人中心 </a>
											</li>
											<li role="presentation" class="li-dropdown" style="border-top: solid 1px #5BC0DE;"><a role="text-center" tabindex="-1" href="#"><span class="glyphicon glyphicon-log-out"></span> 退出登录</a></li>
										</ul>
									</div>
								</li>
								<li style="height: 50px;">
									<a href="#" class="btn navbar-btn" id="message">
										<span class="badge pull-right">42</span>消息
									</a>
								</li>
							</ul>
						</div>
					</div>
				</div>
			</div>
		</nav>
		<div class="container">
			<div class="row">
				<div class="col-md-3">
					<div class="side-container panel panel-default">
						<div class="panel-heading" id="side_tittle">部门架构</div>
						<div class="panel-body" id="side_body">
							<div id="orgTree" class="ztree showIcon"></div>
						</div>
					</div>
				</div>
				<div class="col-md-9">
					
			
				</div>
			</div>
		</div>

		<div class="list-group" id="rMenu">
			<button type="button" id="m_add" class="list-group-item" onclick="addTreeNode();"><span class="glyphicon glyphicon-plus-sign" style="margin-right: 10px;"></span>增加</button>
			<button type="button" id="m_del" class="list-group-item" onclick="removeTreeNode();"><span class="glyphicon glyphicon-minus-sign" style="margin-right: 10px;"></span>删除</button>
			<button type="button" id="m_edit" class="list-group-item" onclick="editTree();"><span class="glyphicon glyphicon-edit" style="margin-right: 10px;"></span>编辑</button>
			<button type="button" id="m_addMember" class="list-group-item" onclick="addMember();"><span class="glyphicon glyphicon-user" style="margin-right: 10px;"></span>添加成员</button>
		</div>

		
		
		<!-- Button trigger modal -->
		<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
		  Launch demo modal
		</button>
		
		<!-- Modal -->
		<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
		  <div class="modal-dialog" role="document">
		    <div class="modal-content">
		      <div class="modal-header">
		        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
		        <h4 class="modal-title" id="myModalLabel">添加部门</h4>
		      </div>
		      <div class="modal-body">
		        <form class="form-horizontal">
					  <div class="form-group">
					    <label class="col-sm-2 control-label"><span class="necessary">*</span>部门名称</label>
					    <div class="col-sm-10">
					      <input  class="form-control" id="depName" placeholder="部门名称">
					    </div>
					    <p class="col-md-10 text-left">&nbsp;&nbsp;请填写部门完整名称</p>
					  </div>
					  <div class="form-group">
					    <label  class="col-sm-2 control-label">权限选择</label>
					    <div class="dropdown col-sm-10" >
						  	<select class="selectpicker form-control" style="width: auto;">
						  		<option>请选择</option>
								 <option>所有人</option>
								 <option>仅本部门</option>
								 <option>仅子部门</option>
							</select>

						</div><br/>
					   	<p class="col-md-10 text-left">&nbsp;&nbsp;所有人：可以看到所有人通讯录</p><br/>
					   	<p class="col-md-10 text-left">&nbsp;&nbsp;仅本部门：可以看到同一部门下所有子组织通讯录</p><br/>
					   	<p class="col-md-10 text-left">&nbsp;&nbsp;仅子部门：可以看到所在子部门及下属子组织通讯录</p>
					  </div>
					  <div class="form-group">
					    <label  class="col-sm-2 control-label"><span class="necessary">*</span>排序号</label>
					    <div class="col-sm-10">
					      <input type="password" class="form-control" id="order" placeholder="排序号">
					    </div>
					    <p class="col-md-10 text-left">&nbsp;&nbsp;用于显示部门先后顺序，数字小的排在前面</p>
					  </div>
					</form>
		      </div>
		      <div class="modal-footer">
		        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
		        <button type="submit" class="btn btn-default save">保存</button>
		      </div>
		    </div>
		  </div>
		</div>
		
		
		<!-- /.modal -->

		<footer class="footer navbar-static-bottom">
			<div class="container">
				<div class="row">
					<div class="col-md-4">
						<a href="/"><img src="logoCP.png" width="175px" style="margin-top: -11px;" height="75px" alt="好知，知识分享新社区"></a>
					</div>
					<div class="col-md-4 about">
						<span><a href="/info/about">关于我们</a></span>|
						<span><a href="/group/feedback/discuss/15754" target="_blank">加入我们</a></span>|
						<span><a href="/daren/" target="_blank">合作申请</a></span>|
						<span><a href="/group/feedback">意见反馈</a></span>
						<br>
						<a class="con" href="http://www.miibeian.gov.cn/" target="_blank"> 浙ICP备13006852号-3</a>
					</div>
					<div class="col-md-4">关注我们：
						<a href="http://weibo.com/howzhicom"><i class="hz-icon icon-weibo"></i></a>
						<a class="icon-sns">
							<i class="hz-icon icon-weixin"></i>
							<div class="sns-popover" style="background:url(&quot;img/weichat.png?2.6.12.2.3&quot;)"></div>
						</a>
						<a href="http://user.qzone.qq.com/2485597828/"><i class="hz-icon icon-qq"></i></a>
						<a href="http://site.douban.com/124522/"><i class="hz-icon icon-gongnengyedouban"></i></a>
					</div>
				</div>
			</div>
		</footer>
		<!--<footer class="">
			数联软件信息技术股份有限公司版权所有 © 2013-2015
		</footer>-->
		<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
		<script src="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
		<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
		<script src="http://cdn.bootcss.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

		<script type="text/javascript" src="js/jquery.ztree.core-3.5.min.js"></script>
		<script type="text/javascript" src="js/jquery.ztree.exedit-3.5.min.js"></script>
		<script type="text/javascript" src="js/jquery.ztree.excheck-3.5.min.js"></script>
		<script type="text/javascript" src="js/orgZTree.js"></script>
		<script type="text/javascript" src="js/checkOrgTree.js" ></script>
		<script type="text/javascript" src="js/index.js"></script>
	</body>
</html>
